<template>
  <div class="operateList">
    <h3 class="title">日记的操作</h3>
    <operateItemVue :operated="operated"></operateItemVue>
  </div>
</template>

<script>
import operateItemVue from "./operateItem.vue";
export default {
  components: {
    operateItemVue,
  },
  data() {
    return {
      operated: [
        {
          icon: "el-icon-edit",
          name: "写日记",
        },
        {
          icon: "el-icon-edit-outline",
          name: "改日记",
        },
        {
          icon: "el-icon-delete",
          name: "删日记",
        },
      ],
    };
  },
  //监听属性 类似于data概念
  computed: {},
  //监控data中的数据变化
  watch: {},
  //方法集合
  methods: {},
  //生命周期 - 创建完成（可以访问当前this实例）
  created() {},
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
};
</script>
<style lang='css' scoped>
.operateList {
  width: 150px;
  background-color: #eee5e5;
  position: relative;
  overflow: hidden;
}
.title {
  text-align: center;
  padding: 10px 0;
  color: rgb(2, 152, 252);
  border-bottom: 5px solid;
}
</style>